<template>
  <el-dialog
      v-model="open"
      :close-on-click-modal="false"
      title="编辑"
      width="680"
      draggable append-to-body destroy-on-close>
    <el-form ref="formDataRef" size="default" :model="formData" :rules="formRules" label-width="100">
      <el-form-item label="名称" prop="name">
        <el-input v-model="formData.name" placeholder="请输入" style="width: 500px"/>
      </el-form-item>
      <el-form-item label="数据地址" prop="path">
        <el-input v-model="formData.path" placeholder="请输入" style="width: 500px"/>
      </el-form-item>
      <el-form-item label="标识" prop="sign">
        <el-input v-model="formData.sign" placeholder="请输入" style="width: 500px"/>
      </el-form-item>
      <el-form-item label="格式" prop="format">
        <el-select v-model="formData.format" placeholder="请选择" style="width: 500px">
          <el-option label="png" value="png"/>
          <el-option label="jpg" value="jpg"/>
        </el-select>
      </el-form-item>


      <el-form-item label="左上角经度" prop="longitude">
        <el-input-number v-model="formData.longitude" max="180" placeholder="请输入" style="width: 500px"/>
      </el-form-item>
      <el-form-item label="左上角纬度" prop="latitude">
        <el-input-number v-model="formData.latitude" max="90" placeholder="请输入" style="width: 500px"/>
      </el-form-item>

      <el-form-item label="图幅个数" prop="sheet_num">
        <el-select v-model="formData.sheet_num" placeholder="请选择" style="width: 500px">
          <el-option label="2*2" value="2*2"/>
          <el-option label="4*4" value="4*4"/>
        </el-select>
      </el-form-item>

      <el-form-item label="分辨率" prop="resolution">
        <el-select v-model="formData.resolution" placeholder="请选择" style="width: 500px">
          <el-option label="14米" :value="14"/>
          <el-option label="30米" :value="30"/>
        </el-select>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="()=>{open=false}">取 消</el-button>
      <el-button type="primary" @click="submit">保 存</el-button>
    </template>

  </el-dialog>
</template>

<script setup>
import {apiDemEdit} from "@/api/index.js";
import $modal from "@/util/element/modal.js";
import {copyObj} from "@/util/kit.js";
import {formRules} from "@/view/gis/dem/option.js";

//open 特殊处理双向绑定
const open = defineModel("open", {default: false})

//普通 props
const props = defineProps({
  data: Object,
  dictValue: {
    default: [],
    type: Array
  },
})

//回调通知
const emit = defineEmits(['ok'])

const {proxy} = getCurrentInstance();

let optionKey = {
  loading: false,
  dictCode: 'enuCommonStatus,enuUserMtAuth',
  dictCodeOption: [],
  openDialog: false,
  tableData: [],
  selectIds: [],
  selectNames: [],
  nowRoleId: 0,
  defaultChecked: [],
  allRole: [],
  tableHeight: 0,
}

const formKey = {}


let formData = reactive(formKey);
let option = reactive(optionKey);

//页面加载完成回调
onMounted(() => {
  formData = reactive(copyObj(props.data))
  //// console.log("Dialog onMounted")
  //// console.log("open.value", open.value)
  //// console.log("props.data",)
  //// console.log("props.dictValue", props.dictValue)
})

onUnmounted(() => {
  //// console.log("Dialog onUnmounted")
});

function submit() {
  proxy.$refs["formDataRef"].validate(valid => {
    if (valid) {
      apiDemEdit(formData).then(res => {
        if (res.code != 200) {
          $modal.error(res.msg);
          return;
        }

        $modal.success();
        emit('ok', {id: 10})
        open.value = false
      })
    }

  });


}
</script>

<style scoped lang="scss">

</style>
